﻿
<Container Fluid>
	<Row Margin="Margin.Is3.FromTop">
		<Column Col="Col.Is9">

			<h2>
				@Title
			</h2>
			<p class="lead">
				@Description
			</p>
			@ChildContent
		</Column>
		<Column Col="Col.Is3">
			<div class="toc text-muted">
				<h6>On this page</h6>
				<hr />
				<ul>
					@if (Indicates is not null)
					{
						@foreach (var item in Indicates)
						{
							<li>
								<a href="javascript:scrollToTitle('@item')" class="text-decoration-none"><small>@item</small></a>
							</li>
						}
					}
				</ul>
			</div>
		</Column>
	</Row>
</Container>
@code {
	[Parameter] public string Title { get; set; }
	[Parameter] public string Description { get; set; }
	[Parameter] public RenderFragment ChildContent { get; set; }
	[Parameter] public string[] Indicates { get; set; }
}